﻿<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8" />
<title>因乐而动 为乐维权</title>
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=0" />
<meta name="format-detection" content="telephone=no">
<meta name="applicable-device" content="mobile">
<link rel="stylesheet" href="style/main.css" />
</head>

<body>

<div class="wrap" style="display:none;">

    <div class="item item-1">
        <div class="content">
            <div class="query"></div>
            <div class="descr">
                <div class="txt-1"></div>
                <div class="txt-2"></div>
            </div>
        </div>
        <div class="tips-arrow"></div>
    </div>

    <div class="item item-2">
        <div class="img">
            <img class="show-pic" src="images/sec-2-pic.jpg" width="100%" alt="展示图">
            <img class="little-shade" src="images/page-move-mask.png" width="100%" alt="小遮罩">
            <img class="big-shade" src="images/sec-2.png" width="100%" alt="大遮罩">
        </div>
        <div class="descr lonely-descr">
            <div class="txt-1"></div>
            <div class="txt-2"></div>
            <div class="txt-3"></div>
            <div class="txt-4"></div>
        </div>
        <div class="tips-arrow"></div>
    </div>

    <div class="item item-3">
        <div class="img">
            <img class="show-pic" src="images/sec-3-pic.jpg" width="100%" alt="展示图">
            <img class="little-shade" src="images/page-move-mask2.png" width="100%" alt="小遮罩">
            <img class="big-shade" src="images/sec-3.png" width="100%" alt="大遮罩">
        </div>
        <div class="descr lonely-descr">
            <div class="txt-1"></div>
            <div class="txt-2"></div>
            <div class="txt-3"></div>
            <div class="txt-4"></div>
        </div>
        <div class="tips-arrow"></div>
    </div>

    <div class="item item-4">
        <div class="img">
            <img class="show-pic" src="images/sec-4-pic.jpg" width="100%" alt="展示图">
            <img class="little-shade" src="images/page-move-mask2.png" width="100%" alt="小遮罩">
            <img class="big-shade" src="images/sec-3.png" width="100%" alt="大遮罩">
        </div>
        <div class="descr lonely-descr">
            <div class="txt-1"></div>
            <div class="txt-2"></div>
            <div class="txt-3"></div>
        </div>
        <div class="tips-arrow"></div>
    </div>

    <div class="item item-5">
        <div class="content">
            <ul id="fragment-pic" class="fragment-pic">
                <li class="flipIn-14">
                    <img src="images/fragment-1.jpg" width="64" height="64" alt="图片碎片">
                </li>
                <li class="flipIn-11">
                    <img src="images/fragment-2.jpg" width="64" height="64" alt="图片碎片">
                </li>
                <li class="flipIn-17">
                    <img src="images/fragment-3.jpg" width="64" height="64" alt="图片碎片">
                </li>
                <li class="flipIn-27">
                    <img src="images/fragment-4.jpg" width="64" height="64" alt="图片碎片">
                </li>
                <li class="flipIn-19">
                    <img src="images/fragment-5.jpg" width="64" height="64" alt="图片碎片">
                </li>
                <li class="flipIn-28">
                    <img src="images/fragment-6.jpg" width="64" height="64" alt="图片碎片">
                </li>
                <li class="flipIn-10">
                    <img src="images/fragment-7.jpg" width="64" height="64" alt="图片碎片">
                </li>
                <li class="flipIn-23">
                    <img src="images/fragment-8.jpg" width="64" height="64" alt="图片碎片">
                </li>
                <li class="flipIn-3">
                    <img src="images/fragment-9.jpg" width="64" height="64" alt="图片碎片">
                </li>
                <li class="flipIn-12">
                    <img src="images/fragment-10.jpg" width="64" height="64" alt="图片碎片">
                </li>
                <li class="flipIn-18">
                    <img src="images/fragment-11.jpg" width="64" height="64" alt="图片碎片">
                </li>
                <li class="flipIn-1">
                    <img src="images/fragment-12.jpg" width="64" height="64" alt="图片碎片">
                </li>
                <li class="flipIn-13">
                    <img src="images/fragment-13.jpg" width="64" height="64" alt="图片碎片">
                </li>
                <li class="flipIn-15">
                    <img src="images/fragment-14.jpg" width="64" height="64" alt="图片碎片">
                </li>
                <li class="flipIn-22">
                    <img src="images/fragment-15.jpg" width="64" height="64" alt="图片碎片">
                </li>
                <li class="flipIn-30">
                    <img src="images/fragment-16.jpg" width="64" height="64" alt="图片碎片">
                </li>
                <li class="flipIn-9">
                    <img src="images/fragment-17.jpg" width="64" height="64" alt="图片碎片">
                </li>
                <li class="flipIn-2">
                    <img src="images/fragment-18.jpg" width="64" height="64" alt="图片碎片">
                </li>
                <li class="flipIn-8">
                    <img src="images/fragment-19.jpg" width="64" height="64" alt="图片碎片">
                </li>
                <li class="flipIn-20">
                    <img src="images/fragment-20.jpg" width="64" height="64" alt="图片碎片">
                </li>
                <li class="flipIn-5">
                    <img src="images/fragment-21.jpg" width="64" height="64" alt="图片碎片">
                </li>
                <li class="flipIn-21">
                    <img src="images/fragment-22.jpg" width="64" height="64" alt="图片碎片">
                </li>
                <li class="flipIn-16">
                    <img src="images/fragment-23.jpg" width="64" height="64" alt="图片碎片">
                </li>
                <li class="flipIn-7">
                    <img src="images/fragment-24.jpg" width="64" height="64" alt="图片碎片">
                </li>
                <li class="flipIn-4">
                    <img src="images/fragment-25.jpg" width="64" height="64" alt="图片碎片">
                </li>
                <li class="flipIn-25">
                    <img src="images/fragment-26.jpg" width="64" height="64" alt="图片碎片">
                </li>
                <li class="flipIn-24">
                    <img src="images/fragment-27.jpg" width="64" height="64" alt="图片碎片">
                </li>
                <li class="flipIn-29">
                    <img src="images/fragment-28.jpg" width="64" height="64" alt="图片碎片">
                </li>
                <li class="flipIn-26">
                    <img src="images/fragment-29.jpg" width="64" height="64" alt="图片碎片">
                </li>
                <li class="flipIn-6">
                    <img src="images/fragment-30.jpg" width="64" height="64" alt="图片碎片">
                </li>
            </ul>
            <div class="descr">
                <div class="txt-1"></div>
                <div class="txt-2"></div>
                <div class="txt-3"></div>
            </div>
        </div>
        <div class="tips-arrow"></div>
    </div>

    <div class="item item-6">
        <div class="content">
            <div class="love"></div>
            <div class="descr">
                <div class="txt-1"></div>
                <div class="txt-2"></div>
                <div class="txt-3"></div>
            </div>
        </div>
        <div class="tips-arrow"></div>
    </div>

    <div class="item item-7">
        <div class="content">
            <div class="my-number">
                <p>我是中国第 <span id="my-num">8888</span> 位音乐爱好者</p>
                <p>我知道2015年世界知识版权日主题是</p>
                <p>“因乐而动，为乐维权”</p>
            </div>
            <div class="title"></div>
            <div class="hand-qq"></div>
            <a class="share-btn btn-share" href="javascript:;">奔走相告</a>
        </div>
    </div>

</div>


<a href="javascript:;" class="audio_btn pause js-btn-bgsong"></a><!--将audio_play 样式名改为 audio_mute 即可设置成静音 -->

<div class="mask" id="mask">
    <div id="loading"><div></div></div>
</div>


<script type="text/javascript" src="script/zepto.min.js"></script>
<script type="text/javascript" src="script/islider.js"></script>
<script type="text/javascript" src="script/main.js"></script>
</body>
</html>